<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>注册</title>

<link rel="stylesheet" type="text/css" href="../resources/css/style.css">
<link rel="stylesheet" type="text/css" href="../resources/css/style2.css">
</head>
<body>

<div class="open">打开窗口</div>

<div class="modal">
	<div class="form">
		<form method="post">
			<label for="name" required="required">账    号</label>
			<input id="name" type="text" name="username"/>
			<!-- <label for="email" required="required">电子邮件</label>
			<input id="email" type="email"/> -->
			
			<label for="pass">密　码</label>
			<input id="pass" type="password" name="password" required="required"/>
			<input type="submit" value="保存"/>


		</form>
	</div>
	<div class="invite">
		<h3>注册现在为我们的屡获殊荣的服务，并获得14天的免费试用。</h3>
		<div class="nope">欢迎注册</div>
		<div title="close" class="close"></div>
	</div>
</div>


<script src="../resources/js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(".close, .nope").on('click', function () {
  $('.modal').addClass('hidden');
  $('.open').addClass('active');
})

$(".open").on('click', function () {
  $(this).removeClass('active');
  $('.modal').removeClass('hidden');
})
</script>

</body>
</html>